// Flexbox 混入
@mixin flex-center {
  display: flex;
  justify-content: center;
  align-items: center;
}

@mixin flex-between {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

// 响应式文本
@mixin responsive-font($desktop, $mobile: null) {
  font-size: $desktop;
  @media (max-width: 768px) {
    font-size: $mobile or $desktop * 0.875;
  }
}

// 过渡效果
@mixin transition($properties: all) {
  transition: $properties 0.3s ease-in-out;
}

// 截断文本
@mixin text-truncate {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
